<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <base href="http://localhost:8080/json_ajax/">
    <script type="text/javascript">
        function ajaxRequest() {
            // 1.我们首先要创建XMLHttpRequest
            let xhr = new XMLHttpRequest();
            // 2、调用open方法设置请求参数
            xhr.open("GET", "AjaxServlet?action=jsAjax", true);
            // 3、在send方法前绑定onreadystatechange事件，处理请求完成后的操作。
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4 && xhr.status === 200) {
                    let person = JSON.parse(xhr.responseText);
                    document.getElementById("div01").innerHTML = `id: ${person.id}, name: ${person.name}`;
                }
            }
            // 4、调用send方法发送请求
            xhr.send();
            alert("最后一行的代码");
        }
    </script>
</head>
<body>
<button onclick="ajaxRequest()">ajax request</button>
<button onclick="ajaxRequest()">ajax request</button>
<button onclick="ajaxRequest()">ajax request</button>
<button onclick="ajaxRequest()">ajax request</button>
<button onclick="ajaxRequest()">ajax request</button>
<button onclick="ajaxRequest()">ajax request</button>
<div id="div01"></div>
</body>
</html>